جستجو در محصولات

گالری پروژه های افتر افکت
گالری پروژه های PSD
جستجو در محصولات


تبلیغ بانک ها در صفحات
ربات ساز تلگرام در صفحات
ایمن نیوز در صفحات
.. سیستم ارسال پیامک ..
آموزش گام به گام HTML :  قسمت سوم
-(7 Body) 
آموزش گام به گام HTML :  قسمت سوم
Visitor 458
Category: دنياي فن آوري

حروف نهادي در HTML

بعضي از حروف مانند > مفهوم خاصي براي HTML دارند، بنابراين از آنها در متن نمي توان استفاده کرد. براي نمايش حروفي مانند > در متن بايد از حروف نهادي استفاده کرد. يک حرف نهادي از سه بخش اصلي تشکيل مي شود :
&يک نام نهادي;
&#يک عدد نهادي;
مثلا براي نمايش > در مرورگر بايد به جاي نوشتن > در فايل HTML بايد &lt; يا &#60; را بنويسيم. فايده استفاده از نام به جاي عدد اينست که همواره نام بهتر از عدد در خاطر مي ماند؛ و ضرر آن اينست که همه مرورگر ها نام هاي نهادي را پشتيباني نمي کنند ولي اکثر آنها اعداد نهادي را پشتيباني مي کنند. در ضمن توجه داشته باشيد که نام هاي نهادي به بزرگي و کوچکي حروف حساس مي باشند. به عنوان مثال اگر بخواهيد عبارت <b>This text is bold</b> در مرورگر نمايش داده شود بايد به شيوه مثال زير عمل کنيد.

نکته
به طور معمول HTML فاصله ها را در متن ناديده مي گيرد؛ مثلا اگر ده فاصله در متن داشته باشيد نه تاي آن ناديده گرفته خواهد شد. براي قرار دادن چندين فاصله در متن بايد از حرف نهادي &nbsp; استفاده کنيد.

حروف نهادي معمول :

نتيجه

نام حرف

نام نهادي

عدد نهادي

non-breaking space

&nbsp;

&#160;

less than

&lt;

&#60;

greater than

&gt;

&#62;

&

ampersand

&amp;

&#38;

"

quotation mark

&quot;

&#34;

'

apostrophe

&#39;


تعدادي ديگر از حروف نهادي مورد استفاده :

نتيجه

نام حرف

نام نهادي

عدد نهادي

?

inverted exclamation mark

&iexcl;

&#161;

¢

cent

&cent;

&#162;

£

pound

&pound;

&#163;

¥

yen

&yen;

&#165;

©

copyright

&copy;

&#169;

«

angle quotation mark (left)

&laquo;

&#171;

®

registered trademark

&reg;

&#174;

°

degree

&deg;

&#176;

±

plus-or-minus

&plusmn;

&#177;

²

superscript 2

&sup2;

&#178;

³

superscript 3

&sup3;

&#179;

µ

micro

&micro;

&#181;

¹

superscript 1

&sup1;

&#185;

»

angle quotation mark (right)

&raquo;

&#187;

¼

fraction 1/4

&frac14;

&#188;

½

fraction 1/2

&frac12;

&#189;

¾

fraction 3/4

&frac34;

&#190;

?

inverted question mark

&iquest;

&#191;

×

multiplication

&times;

&#215;

÷

division

&divide;

&#247;


رنگ ها در HTML

از رنگها توسط سه شيوه RGB و HEX و Name مي توان استفاده کرد. مثلا هر سه دستور زير رنگ پس زمينه را به سياه تغيير خواهند داد.
<body bgcolor="#000000">
<body bgcolor="rgb(0,0,0)">
<body bgcolor="black">
در استفاده از رنگها بهتر است از شيوه Name استفاده نکنيد و دو شيوه ديگر را به کار ببريد چون نام رنگها براي همه مرورگرها قابل استفاده نمي باشد. توسط دستور rgb مي توانيد تا 16 ميليون رنگ بسازيد يعني 256×256×256 .
نمونه اي از نام رنگها و شماره هاي آنها را در جدول زير مي بينيد.

Color Name

Color HEX

Color RGB

black

#000000

rgb(0,0,0)

red

#FF0000

rgb(255,0,0)

lime

#00FF00

rgb(0,255,0)

blue

#0000FF

rgb(0,0,255)

yellow

#FFFF00

rgb(255,255,0)

aqua

#00FFFF

rgb(0,255,255)

fuchsia

#FF00FF

rgb(255,0,255)

silver

#C0C0C0

rgb(192,192,192)

white

#FFFFFF

rgb(255,255,255)

در جدول زير نمونه اي از رنگ ها و شيوه استفاده از اعداد براي ساخت رنگهاي مختلف را مي بينيد.

Color

Color Name

Color HEX

RGB(0,0,0)

#000000

RGB(64,64,64)

#404040

RGB(128,128,128)

#808080

RGB(192,192,192)

#C0C0C0

RGB(232,232,232)

#E8E8E8

RGB(255,255,255)

#FFFFFF

براي آشنايي با طريقه ايجاد رنگهاي مورد نظر به دو مثال زير توجه کنيد.

فونت ها در HTML

براي تعيين نوع فونت ورنگ ويا اندازه آن در يک فايل HTML مي توان از برچسب <font> استفاده کرد. اگر چه هنوز عده زيادي از اين شيوه استفاده مي کنند و حتي نرم افزار FrontPage نيز از اين شيوه استفاده مي کند؛ استفاده از اين برچسب توصيه نمي شود. و بهتر است از شيوه هاي نگارش (CSS) استفاده کنيد. در اينجا فقط براي آشنايي با برچسب <font> به توضيح آن مي پردازيم اما شما سعي کنيد از اين برچسب استفاده نکنيد. برچسب <font> داراي سه مشخصه size، face و color مي باشد که در جدول زير شرح داده شده اند.

مشخصه

مثال

کاربرد

size="number"

size="2"

اندازه فونت را تعيين مي کند

size="+number"

size="+1"

فونت را بزرگتر مي کند

size="-number"

size="-1"

فونت را کوچکتر مي کند

face="face-name"

face="Times"

نام فونت را تعيين مي کند

color="color-value"

color="#eeff00"

شماره رنگ فونت را تعيين مي کند

color="color-name"

color="red"

نام رنگ فونت را تعيين مي کند


مثال زير طريقه استفاده از مشخصه هاي ذکر شده را نشان مي دهد.

لينک ها در HTML

برچسب <a> و مشخصه href
HTML از برچسب <a> که a حرف اول کلمه anchor به معني لنگر مي باشد، براي ساختن پيوند با ديگر فايلها استفاده مي کند (به جاي استفاده از کلمه پيوند از کلمه آشناي لينک استفاده خواهيم کرد). يک لينک مي تواند به هر منبعي در وب اشاره داشته باشد : يک صفحه HTML ديگر، يک تصوير، يک موزيک، يک فيلم يا هر چيز ديگري. قاعده ساخت يک لينک به صورت زير مي باشد.
<a href="url">Text to be displayed</a>
مشخصه href براي مشخص کردن آدرس فايلي که مي خواهيم به آن لينک ايجاد کنيم، به کار مي رود؛ و کلمات بين برچسب ابتدايي و انتهايي به شکل فراپيوند (hyperlink) نشان داده خواهد شد. به عنوان مثال خط زير يک لينک به سايت Rasekhoon ايجاد مي کند.
<a href="http://www. Rasekhoon.net/">Visit Rasekhoon!</a>
دستور فوق در يک مرورگر به شکل روبرو ديده مي شود : Visit Rasekhoon!

مشخصه target

توسط مشخصه target شما مي توانيد مشخص کنيد که فايل پيوند داده شده به آن کجا باز شود. به عنوان مثال دستور زير سايت Rasekhoon را در پنجره جديدي نشان مي دهد.
<a href="http://www. Rasekhoon.net/"
target="_blank">Visit Rasekhoon!</a>

مشخصه Target

کاربرد

target="_blank"

يک فايل يا آدرس جديد را در يک پنجره جديد باز خواهد کرد.

target="_self"

يک فايل يا آدرس جديد را در پنجره فعلي باز خواهد کرد.

target="_parent"

يک فايل يا آدرس جديد را در قاب اصلي(parent frame) باز خواهد کرد. (راجع به قابها در مباحث بعدي صحبت خواهيم کرد.)

target="_top"

يک فايل يا آدرس جديد را در کل پنجره فعلي باز خواهد کرد ( راه جالبي براي خارج شدن از قاب ها)


مشخصه name

مشخصه name براي ساختن يک لينک داراي نام استفاده مي شود. توسط لينک داراي نام شما مي توانيد لينکي بسازيد که به قسمت خاصي از صفحه مستقيما جهش داشته باشد به جاي اين که کار بر را مجبور به پيمودن صفحه کنيد تا به قسمت مورد نظر برسد. قاعده ساخت يک لينک داراي نام به صورت زير است :
<a name="label">Text to be displayed</a>
هنگامي که مي خواهيد به يک لينک داراي نام متصل شويد بايد به انتهاي نام فايل علامت # را اضافه کرده سپس نام لينک مورد نظر را بنويسيد. مثلا اگر دستورات زير را در فايلي به نام test1.htmذخيره کنيد
<p>This is a text. This is a text. This is a text.</p>
<p>This is a text. This is a text. This is a text.</p>
<a name="tips">Read the Useful Tips section</a>
<p>This is a text. This is a text. This is a text.</p>
<p>This is a text. This is a text. This is a text.</p>
و دستورات زير را در فايلي به نام test2.htm ذخيره کنيد
<a href="test1.htm#tips">
Read the Useful Tips section</a>
و فايل test2.htm را باز کنيد و روي لينک موجود کليک کنيد، فايل test1.htm باز خواهد شد و به بخش tips خواهد رفت. همچنين شما مي توانيد از طريق پيوند داراي نام به بخشي از صفحه فعلي که توسط مرورگر در حال نمايش است برويد. مثلا اگر دستورات زير را در فايل test.htm نوشته و آن را ذخيره و توسط مرورگر باز کنيد، سپس روي Useful Tips کليک کنيد صفحه به سوي بخش tips جهش مي کند.


لينک به يک آدرس E-Mail

گاهي اوقات مي خواهيم در صفحه وب خود آدرس E-Mail خود را در اختيار بينندگان سايت قرار دهيم، که به راحتي مي توانيم اين کار را با نوشتن آدرس خود مثلا داخل يک پاراگراف عملي سازيم. مانند :
<p>My E-Mail adress is : you@yourname.com</p>
اما اگر بخواهيم يک لينک به آدرس E-Mail خود ايجاد کنيم که به طور خودکار يکي از برنامه هاي مخصوص E-Mail را در رايانه کاربر باز کرده و بعضي از موارد مورد نياز مانند آدرس و موضوع و... را به طور خودکار در قسمتهاي مخصوص خود بنويسد و بدين ترتيب کار کاربر را کم کند، بايد از شيوه اي همانند دستور زير استفاده کنيم :
<a
href="mailto: you@yourname.com?Subject=Hello%20again">
Send Mail</a>
مثال زير مطلب را روشن تر خواهد کرد :

دستورات فوق را در فايل test.htm ذخيره کرده و آن را باز کنيد يا بر روي دکمه مشاهدا خروجي کليک کنيد. اگر بر روي Send mail! کليک کنيد برنامه Outlook Express باز خواهد شد و همانطور که مي بينيد تعدادي از موارد به طور پيش فرض توسط شما مشخص شده است.

چند نکته مفيد :

* هرگاه که مي خواهيد لينکي به يک شاخه ايجاد کنيد در انتهاي نام شاخه يک / اضافه کنيد چون اگر بخواهيد مثلا لينکي به شاخه html در سايت yourname.com ايجاد کنيد و از ساختارhref="http://www.yourname.com/html" استفاده کنيد يک تقاضاي اضافه به سرور وب خود تحميل خواهيد کرد چون سرور ابتدا به انتهاي آدرس فوق يک / اضافه مي کند سپس به آدرس جديد که آدرس زير است پاسخ مي دهد و صفحه لازم را براي کاربر مي فرستد :
href="http://www.yourname.com/html/"
*لينک هاي داراي نام غالب براي ساخت فهرست مندرجات فايل هاي طولاني در ابتداي صفحه استفاده مي شوند. به اين صورت که هر فصل يک لينک داراي نام دارد و لينکي به هر يک از آنها در ابتداي صفحه داده مي شود.
*توجه داشته باشيد هنگامي که در مشخصه href مي خواهيد از فاصله استفاده کنيد بايد فاصله را با %20 جايگزين کنيد تا مطمئن باشيد که فاصله ها به درستي توسط مرورگر تشخيص داده خواهند شد.
ادامه دارد ......
ارسال مقاله توسط عضو محترم سايت با نام کاربري : davidfattahi
Add Comments
Name:
Email:
User Comments:
SecurityCode: Captcha ImageChange Image